<extend name="Base:base" />
<block name="main-content">
<link href="__PUBLIC__/css/store-user.css" rel="stylesheet">
<div id="ListBox" class="box1200 container">
	<div class="path15">
		<a href="__APP__/Home/Food">首页</a>&nbsp;&nbsp;&nbsp;>&nbsp;&nbsp;&nbsp;<a
			href="__APP__/Home/User">个人中心</a>&nbsp;&nbsp;&nbsp;>&nbsp;&nbsp;&nbsp;<a
			href="#">收货地址</a>&nbsp;&nbsp;&nbsp;>
	</div>

	<div class="ListBox">
		<div class="zlxgBox-left">
			<div class="zlxgBox-left-bt"></div>
			<ul>
				<li><a href="__APP__/Home/User">个人资料</a></li>
				<li class="chosen"><a href="#">收货地址</a></li>
				<li><a href="__APP__/Home/User/order">订单列表</a></li>
				<li><a href="__APP__/Home/User/pwd">修改密码</a></li>
			</ul>
		</div>
		<div class="zlxgBox-right">
			<div class="zlxgBox-right-bt"></div>
			<div style="margin: 20px;">
				<div align="right">
					<button type="button" class="btn btn-primary btn-add">添加地址</button>
				</div>
				<div class="row" style="margin-top: 20px;">
					<foreach name="list" item="v">
						<div class="col-xs-4">
							<div id="{$v.id}" class="panel <?php $store = session('store'); if($v['id'] == $store["address_id"]){echo "panel-success panel-active";}else{echo "panel-default";} ?>">
								<div class="panel-heading" >
									<div class="panel-title">
										<h3 class="panel-title" style="position: relative;"><a class="text-center">{$v.area}({$v.name}收)</a><a href="javascript:void(0);"><i id="del_{$v.id}" class="btn-delete glyphicon glyphicon-remove" style="float: right;display: none;"></i></a></h3>
									</div>
									
								</div>
								<div class="panel-body">
									{$v.address}<br />{$v.phone_number}<a href="javascript:void(0);"><small class="set" id="set_{$v.id}" style="float: right;display: none;">设置默认</small></a>
								</div>
							</div>
						</div>
					</foreach>
				</div>
			</div>
		</div>

	</div>
</div>
<!-- 删除菜单弹出框 -->
<div class="modal fade" id="myDeleteModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">删除</h4>
			</div>
			<div class="modal-body">
				<p id="sccontent" style="font-size: 15px">你确定要删除该收货地址吗？该操作不可恢复！</p>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				<button type="button" class="btn btn-danger">确定</button>
			</div>
		</div>
	</div>
</div>
<!-- 添加菜单弹出框 -->
<div class="modal fade" id="myAddModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog" style="width: 900px;">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">添加</h4>
			</div>
			<div class="modal-body">
				<form class="form-horizontal style-form" id="form_add"
					action="__APP__/Home/User/addAdr" method="post"
					enctype="multipart/form-data">
					<div class="form-group">
						<label class="col-sm-2 control-label">联系人姓名：</label>
						<div class="col-sm-9 ">
							<input type="text" name="name" class="form-control" id="add_name">
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-2 control-label">联系人电话：</label>
						<div class="col-sm-9 ">
							<input type="tel" name="phone_number" class="form-control" id="add_phone">
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-2 control-label">区域：</label>
						<div class="col-sm-9 ">
							<select class="form-control" name="area" id="add_area">
								<option value=""></option>
								<foreach name="areas" item="area">
								<option value="{$area.area_name}">{$area.area_name}</option>
								</foreach>
							</select>
						</div>
					</div>
					<div class="form-group">
						<label class="col-sm-2 control-label">联系人地址：</label>
						<div class="col-sm-9 ">
							<input type="text" name="address" class="form-control" id="add_address">
						</div>
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				<button type="button" class="btn btn-danger">确定</button>
			</div>
		</div>
	</div>
</div>
<!-- end row --> </block>
<block name="js-content"> <script type="text/javascript">
var changeAddUrl = "__APP__/Home/User/changeAdd";
var deleteAddUrl = "__APP__/Home/User/deleteAdd";
var id = "";
$(".btn-add").click(function(e){
	$("#myAddModal").modal('show');
});
function checkMobile(s){
	var regu =/^[1][0-9]{10}$/;
	var re = new RegExp(regu);
	if (re.test(s)) {
	        return true;
	}else{
	       return false;
	}
}
$('#myAddModal').on('click','button.btn-danger',function (a){
	var name = $("#add_name").val();
	var phone = $("#add_phone").val();
	var area = $("#add_area").val();
	var address = $("#add_address").val();
	if(name==""){
		alert("联系人姓名不能为空");
		return;
	}
	if(phone==""){
		alert("联系人电话不能为空");
		return;
	}else if(!checkMobile(phone)){
		alert("联系人电话格式错误");
		return;
	}
	if(area==""){
		alert("区域不能为空");
		return;
	}
	if(address==""){
		alert("联系人地址不能为空");
		return;
	}
	$("#form_add").submit();
});
$(".panel")
.mouseover(function(e){
// 	console.log("mouseover");
	if(!$(this).hasClass("panel-active")){
		$(this).removeClass("panel-default");
		$(this).addClass("panel-success");
		$("#del_"+this.id).show();
		$("#set_"+this.id).show();
	}
})
.mouseout(function(e){
// 	console.log("mouseout");
	if(!$(this).hasClass("panel-active")){
		$(this).addClass("panel-default");
		$(this).removeClass("panel-success");
		$("#del_"+this.id).hide();
		$("#set_"+this.id).hide();
	}
});
$(".set").click(function(e){
	$parent = $(this).parents('.panel');
	var id = $parent.attr('id'); 
	$.post(changeAddUrl,{id:id},function(data){
		if(data){
			$("#del_"+id).hide();
			$("#set_"+id).hide();
		}
	});
	$('.panel-active').removeClass("panel-success");
	$('.panel-active').addClass("panel-default");
	$('.panel-active').removeClass("panel-active");
	$parent.removeClass("panel-default");
	$parent.addClass("panel-success");
	$parent.addClass("panel-active");
});
$(".btn-delete").click(function(e){
	$parent = $(this).parents('.panel');
	id = $parent.attr('id'); 
	$("#myDeleteModal").modal('show');
});
$('#myDeleteModal').on('click','button.btn-danger',function (a){
	$.post(deleteAddUrl,{id:id},function(data){
		if(data){
			alert('删除收货地址成功!');
			location.reload();
		}else{
			alert('删除收货地址失败!');
		}
	});
});
</script> </block>